<table width="100%" cellspacing="10">
	<tr>
		<td valign="top" width="60%">
			<form id="signin" action="#">
				<table width="100%" cellpadding="4" cellspacing="3">
					<tr>
						<td colspan="3" align="left" valign="bottom"><a href="http://www.orientechnologies.com/orient-db.htm"><img border="0"
								src="images/orient_db.png" /> </a><b class="help"> Studio</b></td>
					</tr>
					<tr>
						<td colspan="2" align="left" class="help"><br>
							<p>Welcome to the OrientDB Studio application. If this is your first time play with the 'demo' database provided in bundle with the
								official OrientDB distribution.</p>
							<p>
								To Login use any database user. By default "<b>reader</b>/reader" can read records from the database, "<b>writer</b>/writer" can read, create,
								update and delete records. "<b>admin</b>/admin" is God.
							</p></td>
					</tr>
					<tr>
						<td align="right" class="ui-widget help">Server:</td>
						<td><input id="server" size="50" value="" class="ui-widget help" /></td>
					</tr>
					<tr>
						<td align="right" class="help">Database:</td>
						<td><table>
								<tr>
									<td id="databaseCell"></td>
									<td><a id="createDatabase" onclick="javascript:createDatabase()" href="#"> Create new database <img border="0" alt="Create new database"
											src="images/add.png" align="top" />
									</a></td>
								</tr>
							</table></td>
					</tr>
					<tr>
						<td align="right" class="ui-widget help">User:</td>
						<td><input id="user" size="25" value="" class="ui-widget help" /></td>
                        <script type="text/javascript">
                                $('#user').val(getRequestParam('user'));
                        </script>
					</tr>
					<tr>
						<td align="right" class="ui-widget help">Password:</td>
						<td><input id="password" type="password" size="25" value="" class="ui-widget help" /></td>
                        <script type="text/javascript">
                                $('#password').val(getRequestParam('password'));
                        </script>
					</tr>
					<tr>
						<td align="center" colspan="2" class="ui-widget help">
							<button type="submit" id="buttonConnect" class="ui-button-text-icon">
								Connect <img border="0" alt="Connect" src="images/connect.png" align="top" />
							</button>
						</td>
					</tr>
					<tr>
						<td colspan="2" align="left" class="help">
							<p>
								To access to the Server's information log into a database and then click on the "Server" tab (top right). To access it you have to click on
								the "Refresh" button (not your browser's refresh) under the OrientDB logo above. When prompted, provide the OrientDB Server's credentials, for
								example "root" as user and the automatic generated password created under the OrientDB installation directory, in the file
								"config/orient-server-config.xml". For more information look at the <a href="http://code.google.com/p/orient/wiki/Security">Security</a> page.
							</p>
						</td>
					</tr>
					<tr>
						<td colspan="2">To report problems use the <a href="http://code.google.com/p/orient/issues/list">Issue Tracker</a>, to receive help jump to
							the <a href="http://groups.google.com/group/orient-database">Forum</a>. Need a <a href="http://www.orientechnologies.com/training.htm">course</a>
							or <a href="http://www.orientechnologies.com/professional.htm#support">professional support</a>?
						</td>
					</tr>
				</table>
			</form>
		</td>
		<td class="drop-shadow" width="40%">
			<table width="100%">
				<tr>
					<td class="help"><b>Quick reference</b>
						<ul>
							<li>General
								<ul>
									<li><a href="http://code.google.com/p/orient/wiki/OrientDB_Studio">OrientDB Studio guide</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQL">SQL overview</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLWhere">SQL where syntax</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLWhere#Operators">Operators</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLWhere#Functions">Functions</a></li>
								</ul>
							</li>
							<li>CRUD operations
								<ul>
									<li><a href="http://code.google.com/p/orient/wiki/SQLQuery">SQL Select used as command and for queries</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLInsert">SQL Insert to insert new records</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLUpdate">SQL Update to update one or more records</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLDelete">SQL Delete to delete one or more records</a></li>
								</ul>
							<li>Security
								<ul>
									<li><a href="http://code.google.com/p/orient/wiki/SQLGrant">SQL Grant</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLRevoke">SQL Revoke</a></li>
								</ul>
							</li>
							<li>Schema
								<ul>
									<li><a href="http://code.google.com/p/orient/wiki/SQLCreateProperty">Create Property</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLRemoveProperty">Remove Property</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLGrant">Create Index</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLGrant">Remove Index</a></li>
									<li><a href="http://code.google.com/p/orient/wiki/SQLGrant">Create Link</a></li>
								</ul>
							</li>
						</ul> For more information look at the <a href="http://code.google.com/p/orient/wiki/Main">Documentation</a>.</td>
				</tr>
			</table>
		</td>
	</tr>
</table>

<script language="javascript">
	function listDatabases(serverUrl) {
		var input = '<input id="database" size="50" value="demo" class="ui-widget help" />';
		try {
			var listDatabaseServer = new ODatabase(serverUrl);
			var response = listDatabaseServer.listDatabases();
			var databases = response['databases'];
            var databaseSelected = getRequestParam('database');
			if (databases != null && databases != 'undefined') {
				input = '<select id="database" class="ui-widget help">';
				for (database in databases) {
                    var selected = '';
                    if (database == (databaseSelected)){
                        selected = 'selected';
                    }
					input = input
							+ '<option value="' + databases[database] + '" >'
							+ databases[database] + selected + '</option>';
				}
				input = input + '<select/>';
			}
		} catch (e) {
		}
		$('#databaseCell').html(input);
        $('#database').val(getRequestParam('database'));
	}

	function connect() {
		if (orientServer == null) {
			orientServer = new ODatabase($('#server').val() + '/'
					+ $('#database').val());
		}
		databaseInfo = orientServer
				.open($('#user').val(), $('#password').val());
		if (databaseInfo == null) {
			jQuery("#output").text(orientServer.getErrorMessage());
			orientServer = null;
		} else {
			controller.loadFragment("panelDatabase.htm", null, null, 'panel');

			$("#navigation").show().ready(function() {
				if (/MSIE (\d+\.\d+);/.test(navigator.userAgent))
					$('#navigation').addClass('navigation-ie');
				else
					$('#navigation').addClass('navigation');

				var d = 1000;
				$('#navigation a').each(function() {
					$(this).stop().animate({
						'marginTop' : '-80px'
					}, d += 300);
				});

				$('#navigation > li').hover(function() {
					$('a', $(this)).stop().animate({
						'marginTop' : '-2px'
					}, 100);
				}, function() {
					$('a', $(this)).stop().animate({
						'marginTop' : '-80px'
					}, 100);
				});
			});

			$('#header-server').val($('#server').val());
			$('#header-database').val($('#database').val());

			$('#header').show();
			$("#buttonConnect").hide();
			$("#buttonDisconnect").show();
		}
		return false;
	}

	$('#signin').submit(function() {
		connect();
		return false;
	});

	$('#createDatabase').click(
			function() {
				controller.loadFragment("panelCreateDatabase.htm", null, null,
						'panel');
				return false;
			});

	$('#server').change(formatServerURL);
	$('#server').val(document.location.href);
	formatServerURL();
	listDatabases($('#server').val());
    
    //autologin
    if (getRequestParam('user') != '' && getRequestParam('password') != '' && getRequestParam('database') != null){
      $('#signin').submit();
    }

	function createDatabase() {
		controller.loadFragment("panelCreateDatabase.htm", null, null, 'panel');
		return false;
	}
</script>